<script setup lang="jsx">
import {computed, inject, provide, ref, watch} from "vue";
import bonusPercentageBill from '@/api/finance/bonusPercentageBill'
const record = inject('record')
const crudRef = inject('crudRef')
const refreshRecode = inject('refreshRecode')
const data = ref([])
const colGap = inject('colGap')
const rowGap = inject('rowGap')
const getDictData = inject('getDictData')
watch(record, (value) => {
  if(value.id != undefined){
    console.log('刷新发放列表--'+record.value.id)
    getStateList()
  }
})
const getStateList = async () => {
    let res = await bonusPercentageBill.getStateList(
        {  "remoteOption":{
            "filter":{
              "bill_id":['=',record.value.id],
            },
            "sort":{
              "id":"desc"
            }
          }
        }
      )
    if (!res.success) {
      return
    }
    for(let i=0;i<res.data.length;i++){
      res.data[i].created_by = getDictData('created_by',res.data[i].created_by)
    }
    data.value = res.data
}

const BackwriteOff = async (id) => {
  let res = await bonusPercentageBill.writeOffRefuse({"state_id":id,"id":record.value.id})
    if (!res.success) {
      return
    }
    refreshRecode()
}

const columns = ref([
  {title: '时间', dataIndex: 'created_at',},
  {title: '动作', dataIndex: 'type',},
  {title: '金额', dataIndex: 'amount',},
  {title: '操作人', dataIndex: 'created_by',},
  {title: '备注', dataIndex: 'remark',},
  {title: '操作', dataIndex: 'id',},
]);
</script>

<template>
  <a-grid-item :span="24">
    <a-collapse :default-active-key="['1']" class="g-collapse-no-p">
      <a-collapse-item header="发放" key="1">
        <!-- <template #extra>
          <a-button-group>
            <a-button type="primary" size="small" @click.stop="" v-auth="[]"><icon-edit/>发放</a-button>
          </a-button-group>
        </template> -->
        <a-grid :cols="{ xs: 1, sm: 2, md: 3, lg: 4}" :colGap="colGap" :rowGap="rowGap">
          <a-grid-item><a-card><a-card-meta :title="getDictData('currency',record.currency)" description="币种" class="text-center"></a-card-meta></a-card></a-grid-item>
          <a-grid-item><a-card><a-card-meta :title="record.amount??''" description="账单金额" class="text-center"></a-card-meta></a-card></a-grid-item>
          <a-grid-item><a-card><a-card-meta :title="record.audit_amount??''" description="已发放" class="text-center"></a-card-meta></a-card></a-grid-item>
          <a-grid-item><a-card><a-card-meta :title="record.unaudit_amount" description="待发放" class="text-center"></a-card-meta></a-card></a-grid-item>
        </a-grid>
        <a-table :columns="columns" :data="data" :bordered="false" :column-resizable="true" :pagination="false">
          <template #columns>
            <a-table-column title='时间' data-index='created_at'>
              <template #cell="{ record }">
                <div>{{record.created_at}}</div>
              </template>
            </a-table-column>
            <a-table-column title='动作' data-index='type'>
              <template #cell="{ record }">
                <div>{{record.type == 1 ? '提成发放':'提成发放撤销'}}</div>
              </template>
            </a-table-column>
            <a-table-column title='金额' data-index='amount'>
              <template #cell="{ record }">
                <div>{{record.amount}}</div>
              </template>
            </a-table-column>
            <a-table-column title='操作人' data-index='created_by'>
              <template #cell="{ record }">
                <div>{{record.created_by}}</div>
              </template>
            </a-table-column>
            <a-table-column title='备注' data-index='remark'>
              <template #cell="{ record }">
                <div>{{record.remark}}</div>
              </template>
            </a-table-column>
            <a-table-column title='操作' data-index='id'>
              <template #cell="{ record }">
                <div>
                  <a-popconfirm
                  content="确定要撤销发放吗?"
                  position="bottom"
                  @ok="BackwriteOff(record.id)"
                  v-if="record.type == 1 && record.status == 0"
                >
                  <a-button type="primary" size="mini" v-auth="['finance:bonusPercentageBill:writeOffRefuse']"><icon-edit />撤销发放</a-button>
                  </a-popconfirm>
                </div>
              </template>
            </a-table-column>
          </template>
        </a-table>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>
</template>

<style scoped>

</style>